<template>
    <!-- 尾部区域 -->
    <footer class="footernull">
        <div class="fnav-box">
            <div class="fnav-01">
                
                <router-link to="/home"><span class="iconfont public-home"></span><p class="footer">首页</p></router-link>
            </div>
            <div class="fnav-01">
                
                <router-link to="/Svideo"><span class="iconfont public-duanshipin"></span><p class="footer">短视频</p></router-link>
            </div>
            <div class="fnav-01">
                
                <router-link to="/Vip"><span class="iconfont public-vip"></span><p class="footer">会员</p></router-link>
            </div>
            <div class="fnav-01">
                
                <router-link to="/Shequ"> <span class="iconfont public-pinglun"></span><p class="footer">社区</p></router-link>
            </div>
            <div class="fnav-01">
                
                <router-link to="/My"><span class="iconfont my-zhishi"></span><p class="footer">我的</p></router-link>
            </div>
        </div>
    </footer>
</template>

<script>

export default{
    name:'Footer'
}

</script>

<style scoped>

/* 尾部区域 */

footer .fnav-box {
    width: 4.14rem;
    height: .58rem;
    background-color: rgb(250, 250, 250);
    position: fixed;
    bottom: 0;
    box-sizing: border-box;
    padding: 0 .15rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

footer .fnav-box .fnav-01 {
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    align-items: center;
    /* border: .01rem solid; */
    text-align: center;
    width: .7rem;
}

footer .fnav-box .iconfont {
    font-size: .26rem;
    font-weight: 600;
}

footer .fnav-box .footer {
    font-size: .08rem;
    -webkit-transform: scale(0.833);
}
.router-link-active {
  color: orange;
}
.router-link-link{
  color: rgb(92, 92, 92);

}
</style>
